.swiper {
  @apply relative flex items-center justify-center h-60 min-h-60 cursor-pointer;
  width: 750px;
}
.item {
  position: absolute;
  transition: all 0.3s linear;
  transform: translateZ(0);
  border-radius: 7px !important;
  overflow: hidden;
  img {
    width: 540px;
  }
  .tag {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 22px;
    line-height: 22px;
    padding: 0 13px;
    color: #fff;
    font-size: 10px;
    opacity: 0.9;
    border-top-left-radius: 8px;
  }
}
.navBox {
  @apply absolute flex justify-between items-center w-full h-full px-6;
  .nav {
    @apply flex justify-center items-center bg-black bg-opacity-30 rounded-full;
    width: 30px;
    height: 30px;
    z-index: 18;
  }
  .next {
    transform: rotate(-180deg);
  }
}
.pagination {
  .dotItem {
    @apply w-2 h-2 rounded-full bg-gray-300 bg-opacity-30 mr-2 cursor-pointer;
  }
  .actived {
    background-color: $theme-color;
  }
}
